<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<style type="text/css">
			.test{
				width: 100px;
				height: 100px;
				background: skyblue;
				position: absolute;
				right: 0;
				bottom: 0;
				z-index: 1;/*控制Z轴的层叠关系，数值越大，优先级越高。*/
				
				}
				/*
				 	绝对定位
				 	快速把元素定位在父元素的某一位置
				 	1. 它是基于body或者是具有定位信息的父元素的左上角，来做对应的定位。
				 	他的位置相对于父亲来说是固定的，不随周边的布局的变化而变化。
				 	
				 	2. 他也是脱离了文档流，所以不占正常页面的面积。
				 	
				 	3. 
				 * */
				.baba{
					width: 500px;
					height: 500px;
					position: absolute;
					left: 100px;
					bottom: 100px;
					background: red;
					
				}
				.test2{
					width: 480px;
					height: 150px;
					background: yellow;
					position: absolute;
					right: 0;
					bottom: 0;
				}
				
		</style>
		<div class="baba">
			<div class="test">
				测试div
			</div>
			<div class="test2">
				测试div
			</div>
			
		</div>	
	</body>
</html>
